import {
  myRequesy
} from '../../request/api'
import {
  useShowToast
} from '../../commons/index'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    title: "", //标题
    note: "", //备注
    isMust: true, //是否必填
    IsMultiple: false, //选择题 是否多选
    numList: [2], //最多可选
    activeIndex: 0, //当前选中
    optionList: [], //添加选项
    isType: 4, //类型,
    value_len: null, //文本题长度
    size: null, //附件大小限制
    tmId: null, //题目Id
    activityId: 37, //活动id 

    // 拖拽
    movableViewInfo: {
      y: 1000,
      showClass: 'none',
      data: {}
    },

    // 拖拽
    pageInfo: {
      rowHeight: 47,
      scrollHeight: 100,
      startIndex: null,
      scrollY: true,
      readyPlaceIndex: null,
      startY: 0,
      selectedIndex: null,
    }
  },
  tmier: null,

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.setData({
      isType: parseInt(options.currentType), //题目
      tmId: parseInt(options.tmId), //题目Id
      activityId: parseInt(options.id) //活动Id
    })
    if (parseInt(options.tmId) !== 0) {
      this.getQuestionDetails()
    }

  },

  dragStart(event) {
    var startIndex = event.detail.currentTarget.dataset.index
    console.log(event, 1111);
    console.log('获取到的元素为', this.data.optionList[startIndex])
    // 初始化页面数据
    var pageInfo = this.data.pageInfo
    pageInfo.startY = event.detail.touches[0].clientY

    pageInfo.readyPlaceIndex = startIndex
    pageInfo.selectedIndex = startIndex
    pageInfo.scrollY = false
    pageInfo.startIndex = startIndex

    this.setData({
      'movableViewInfo.y': pageInfo.startY - (pageInfo.rowHeight / 2)
    })
    // 初始化拖动控件数据
    var movableViewInfo = this.data.movableViewInfo
    movableViewInfo.data = this.data.optionList[startIndex]
    movableViewInfo.showClass = "inline"

    this.setData({
      movableViewInfo: movableViewInfo,
      pageInfo: pageInfo
    })
  },

  dragMove(event) {
    var optionList = this.data.optionList
    var pageInfo = this.data.pageInfo
    // 计算拖拽距离
    var movableViewInfo = this.data.movableViewInfo
    var movedDistance = event.detail.touches[0].clientY - pageInfo.startY
    movableViewInfo.y = pageInfo.startY - (pageInfo.rowHeight / 2) + movedDistance
    console.log('移动的距离为', movedDistance)

    // 修改预计放置位置
    var movedIndex = parseInt(movedDistance / pageInfo.rowHeight)
    var readyPlaceIndex = pageInfo.startIndex + movedIndex
    if (readyPlaceIndex < 0) {
      readyPlaceIndex = 0
    } else if (readyPlaceIndex >= optionList.length) {
      readyPlaceIndex = optionList.length - 1
    }

    if (readyPlaceIndex != pageInfo.selectedIndex) {
      var selectedData = optionList[pageInfo.selectedIndex]

      optionList.splice(pageInfo.selectedIndex, 1)
      optionList.splice(readyPlaceIndex, 0, selectedData)
      pageInfo.selectedIndex = readyPlaceIndex
    }
    // 移动movableView
    pageInfo.readyPlaceIndex = readyPlaceIndex
    // console.log('移动到了索引', readyPlaceIndex, '选项为', optionList[readyPlaceIndex])

    this.setData({
      movableViewInfo: movableViewInfo,
      optionList: optionList,
      pageInfo: pageInfo
    })
  },

  dragEnd(event) {
    // 重置页面数据
    var pageInfo = this.data.pageInfo
    pageInfo.readyPlaceIndex = null
    pageInfo.startY = null
    pageInfo.selectedIndex = null
    pageInfo.startIndex = null
    pageInfo.scrollY = true
    // 隐藏movableView
    var movableViewInfo = this.data.movableViewInfo
    movableViewInfo.showClass = 'none'

    this.setData({
      pageInfo: pageInfo,
      movableViewInfo: movableViewInfo
    })
  },



  // 获取题目详情
  getQuestionDetails() {
    let that = this
    myRequesy({
      url: 'get-question',
      data: {
        q_id: this.data.tmId
      }
    }).then(res => {
      if (res.code === 0) {
        let {
          title,
          note,
          is_required,
          is_multiple,
          select_num,
          value_len,
          size,
          option_list
        } = res.data
        that.setData({
          title,
          note,
          size: size ? size : null,
          value_len,
          isMust: is_required,
          IsMultiple: is_multiple,
          activeIndex: select_num - 2,
          optionList: option_list
        })
        that.getNumList()
      }
    })
  },


  // 可选数字列表
  getNumList() {
    let {
      optionList,
      numList
    } = this.data
    if (optionList.length > 2) {
      for (let i = 3; i <= optionList.length; i++) {
        numList.push(i)
        this.setData({
          numList
        })
      }
    }
  },

  // Input 标题输入值
  headleInputTitle(e) {
    this.setData({
      title: e.detail.value
    })
  },

  // Input 备注输入值
  headleInputNote(e) {
    this.setData({
      note: e.detail.value
    })
  },

  // 是否必填
  headleIsMust(e) {
    this.setData({
      isMust: e.detail.value
    })
  },

  //选择题 是否多选
  headleIsMultiple(e) {
    this.setData({
      IsMultiple: e.detail.value
    })
  },


  // 最多可选 选中
  headleActiveChange(e) {
    this.setData({
      activeIndex: e.detail.value
    })
  },

  //选择题 添加题目
  headleAdd() {
    let {
      numList,
      optionList
    } = this.data
    myRequesy({
      url: 'add-option',
      method: 'POST'
    }).then(res => {
      if (res.code === 0) {
        optionList.push(res.data)
        this.setData({
          optionList
        })
        if (optionList.length > 2) {
          numList.push(optionList.length)
          this.setData({
            numList
          })
        }
      }
    })
  },

  //选择题 删除题目
  headleDelect(e) {
    let {
      numList,
      optionList,
      activeIndex
    } = this.data
    optionList.splice(e.detail, 1)
    if (optionList.length > 1) {
      numList.splice(optionList.length - 1, 1)
      if (activeIndex > optionList.length - 2) {
        activeIndex = 0
      }
    }

    this.setData({
      optionList,
      numList,
      activeIndex
    })

  },

  //选择题 题目 输入值
  headleInputVal(e) {
    let {
      value
    } = e.detail.detail
    let {
      index
    } = e.detail.currentTarget.dataset
    let {
      optionList
    } = this.data
    optionList[index].content = value
    this.setData({
      optionList
    })

  },


  // 文本题 长度限制
  bindinputMaxVal(e) {
    let {
      value
    } = e.detail
    let {
      value_len
    } = this.data
    if (parseInt(value) > 999) {
      this.setData({
        value_len: 999
      })
    } else {
      this.setData({
        value_len: value
      })
    }

  },

  // 附件题 大小限制
  headleSize(e) {
    let {
      value
    } = e.detail
    let {
      size
    } = this.data
    if (parseInt(value) > 10) {
      this.setData({
        size: 10
      })
    } else {
      this.setData({
        size: value
      })
    }
  },


  // 附件题 当前选中
  headleMedia(e) {
    this.setData({
      isType: e.currentTarget.dataset.index
    })
  },


  // 取消 返回
  headleCancel() {
    wx.navigateBack()
  },

  // 确定
  headleConfirm() {
    if (this.tmier) {
      clearInterval(this.tmier)
    }
    this.tmier = setTimeout(() => {
      let that = this
      let {
        activityId,
        optionList,
        title,
        note,
        isMust,
        isType,
        IsMultiple,
        activeIndex,
        numList,
        value_len,
        size,
        tmId
      } = that.data
      if (title.trim() == '') {
        useShowToast('标题不能为空')
      } else if (isType === 4 && optionList.length < 2) {
        useShowToast('选择题最少设置两个选项')
      } else {
        wx.showLoading({
          title: "提交中",
          mask: true
        })
        myRequesy({
          url: 'add-question',
          method: 'POST',
          data: {
            a_id: activityId,
            q_id: tmId ? tmId : '',
            title,
            note,
            q_type: isType,
            is_required: isMust,
            is_multiple: IsMultiple,
            select_num: numList[activeIndex],
            value_len: value_len ? value_len : 0,
            size: size ? size : 0,
            option_list: optionList
          }
        }).then(res => {
          if (res.code === 0) {
            wx.hideLoading({
              success: (res) => {
                let pages = getCurrentPages();
                let prevPage = pages[pages.length - 2];
                prevPage.getQuestionList(activityId)
                wx.navigateBack({
                  url: '/pages/subject/subject',
                })
              },
            })

          }
        })
      }
    }, 1000)
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})